<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <title>scaffoldStyle prototype</title>
        <script src=http://google.com/jsapi>
        </script>
        <script>
            google.load("jquery", "1.3.2");
            google.load("jqueryui", "1.5.3");
        </script>
        <script src=js/jquery.scaffoldStyle.js>
          // http://scaffoldstyle.googlecode.com/svn/trunk/code/jquery.scaffoldStyle.js
        
        </script>
        <script>
            $(function(){
                 $('body *').scaffoldStyle();
                $('hide').hide();
            });
        </script>
        <link rel="stylesheet" type="text/css" href="css/original_styles.css" media="all">
    </head>
    <body>
        <div id="wrap" class="whole_wrap">        	<div id="testing_theme_gen">        	    <div id="theme_gen_step1">Theme name<input type="text" />        	    <input type="checkbox" name="header" id="cms_region-1" checked="checked">header        	    <input type="checkbox" name="" id="cms_region-2">left        	    <input type="checkbox" name="" id="cms_region-3">right        	    <input type="checkbox" name="" checked="checked" id="cms_region-4">center        	    <input type="checkbox" name="" id="cms_region-5" checked="checked">footer        	    <a class="t" href="#">generate files</a>        	    <a href="#" class="s">scaffold</a>        	    </div>        	            	    div#theme_gen_step2        	    <script type="text/javascript">        	        $(document).ready(function(){        	            $('a.t').click(function(){        	                var theVal = $('input').attr('value');        	                var styleVal =$('.warped_tab');
                          var generatedStyleDeclarations = $('.warped_tab').text().toString();        	                        	                // generate both files on click        	                $('div.loader').load('generate.info.php?themeName=' + theVal);        	                $('div.loader2').load('generate.style.php?generatedStyleDeclarations=' + styleVal);        	                $('div.loader3').load('generate.tpl.php?themeName=' + theVal);
                           
                           
                            // save generated style in file
                          $('div.loader4').load('saved.styles.php');        	            });        	            $('.s').click(function() {        	              console.log($('.warped_tab').text());        	            });        	        	        });        	        	    </script>        	    <div class="loader">        	    </div>        	    <div class="loader2"></div><div class="loader3"></div><div class="loader4"></div>        	</div>        	<hide>        	    h2.site_title+ul.main_nav>li.item-$*7+div.showcase>h1.page_heading+h3.page_sub_heading+button.find_more+div.content_block-$*3>h4.section_title+p*2 <h2 class="site_title">scaffold style</h2>        	</hide>
        	<div id="page_wrap">        	    <h2 class="site_logo">scaffoldStyle</h2>        	    <ul class="main_nav">        	        <li class="item-1">        	            <a href="/">how to use</a>        	        </li>        	        <li class="item-2">        	            <a href="/">documentation</a>        	        </li>        	        <li class="item-3">        	            <a href="/">download</a>        	        </li>        	        <li class="item-4">        	            <a href="/">wiki</a>        	        </li>        	        <li class="item-5">        	            <a href="/">forum</a>        	        </li>        	        <div class="showcase">        	            <h1 class="page_heading">Scaffold in style</h1>        	            <h3 class="page_sub_heading">rapid development with dynamic scaffold generation</h3>        	            <button class="find_more">        	                download        	            </button>        	        </div>        	        <div class="datblock content_block-1">        	            <h4 class="section_title">Rapid Coding</h4>        	            <p>        	                Duis pellentesque volutpat placerat. Nulla facilisi. Nam faucibus dolor lectus, sed molestie         	            </p>        	            <p>        	                dolor? Quisque pretium, dui non semper congue, odio dolor tincidunt nibh, vitae varius dui         	            </p>        	        </div>        	        <div class="datblock content_block-2">        	            <h4 class="section_title">et ipsum egestas porta. Suspendi</h4>        	            <p>        	                urna id libero. Pellentesque ullamcorper leo ac erat feugiat ac consectetur odio gravida.         	            </p>        	            <p>        	                Donec odio massa, bibendum tincidunt mattis sit amet, semper quis orci. Fusce iaculis nisl         	            </p>        	        </div>        	        <div class="datblock content_block-3">        	            <h4 class="section_title">sse potenti. Nulla sit amet nisl ultrice</h4>        	            <p>        	                s purus feugiat convallis! Maecenas lib        	            </p>        	            <p>        	                s purus feugiat convallis! Maecenas lib        	            </p>        	        </div>        	        <div class="footer">        	            <p>        	                Copyright (c) 2009 BY Software Inc        	            </p>        	        </div>        	    </ul>        	</div>        	<h1>create form to make theme packages</h1>        </div>
    </body>
</html>
